<template>
  <el-tabs v-model="activeName" @tab-click="handleClick">
            <el-tab-pane label="店铺销售" name="first">
              <div v-if="activeName==='first'">
                <el-row type="flex" justify="center" align="middle" style="margin:20px 0 50px 0">
                  <el-col :span="13">
                    <div class="block">
                      <span class="demonstration">日期：</span>
                      <el-date-picker
                        v-model="value1"
                        type="daterange"
                        range-separator="至"
                        start-placeholder="开始日期"
                        end-placeholder="结束日期">
                      </el-date-picker>
                    </div>
                  </el-col>
                  <el-col :span="5" >
                    销售额：{{store.saleroom}}.
                  </el-col>
                  <el-col :span="5">
                    总订单量：35451元
                  </el-col>
                </el-row>
                <el-row type="flex" justify="center" align="center" v-if="this.pieData">
                  <pie :pieData="pieData"  />
                </el-row>
              </div>
            </el-tab-pane>
            <el-tab-pane label="店铺消费" name="second">
              <div v-if="activeName==='second'">
                <el-row type="flex" justify="center" align="center" >
                  <pie  :pieData="pieData"/>
                </el-row>
              </div>
            </el-tab-pane>
      </el-tabs>
</template>

<script>
import Pie from './pie.vue'
import {getPie} from '@/api/storeManage'
export default {
  props: {
    store: {
      type: Object,
      required: true
    }
  },
  components: {
    Pie
  },
  data () {
    return {
      activeName: 'first',
      value1: [new Date(2000, 10, 10, 10, 10), new Date(2000, 10, 11, 10, 10)],
      pieData:''
    }
  },
  methods: {
    handleClick (tab, event) {
      console.log(tab, event)
    }
  },
  async created(){
    var result =  await getPie()
    this.pieData = result[0]
  }
}
</script>

<style>

</style>
